html > body {left:0;}	
body {
    background-color: white;
    color: black;
    padding: 0;
    margin: 0;
    font-family: arial, "lucida console", sans-serif;
}

/* Emulate table align=center */
div.centered, td.centered { 
	text-align: center;
}
div.centered table { 
	margin: 0 auto; 
	text-align: left;
}

table#projects, #projects td, #projects th{
	border: 1px solid #000000;
}

/* leave some space around the text */
table.projects td{
	padding-left: .5em;
	padding-right: .5em; /* for centred cells */
}

/*
 * id sections
 */
#content {
    width : 70%;
    float: left;
    padding-top: 1em;
    padding-left: 5px;
    margin-left: 10px;
    border-left: 1px solid #ddd;
}

#footer {
    clear: both;
    margin: 0 2em;
    color: #999;
    background-color: #eee;
    text-align: center;
    padding: .5em 0;
    font-size: 75%;
    border-top: 1px solid #ccc;
}

#map {
    width: 100%;
    height: 400px;
    text-align:center;
    margin: 1em auto;
    padding: 3px;
    border: 1px double #bbb;
}
#navLeft {
    clear: left;
    width: 15%;
    float: left;
    padding: 2px;
    margin-left: 1%;
    color: red;
    position:relative;left:1px;  /* This is Tantek hack					*/
    voice-family: "\"}\"";	     /* http://tantek.com/CSS/Examples/boxmodelhack.html	*/
    voice-family:inherit;	     /* We need to use left:1px because IE draws box incorrectly*/
    left: 0;
}
#title {
    color: black;
    background-color: #eee;
    text-align: center;
    border-bottom: 1px solid #ccc;
    padding: 0;
    margin: 0 1%;
    font-size: 16pt;
    height: 70px;
    vertical-align: middle;
}

/*
 * a
 */
a {
    color: blue;
    text-decoration: underline;
}

  a img {
    border: 0;
  }

  a:hover {
      text-decoration: none;
      background-color:#d7c9c9;
  }

/*
 * h1
 */
h1 {}

  #title h1 {
    padding: 2px 0;
    margin: 0;
    float: left;
    width: 50%;
    text-align: center;
  }

/*
 * h2
 */
h2 {}

  #title h2 {
    padding: 0;
    margin: 0;
  }
  #content h2.year {
    background-color: #ddd;
    text-align: center;
  }

h3 {}

  #content h3.monthName {
    background-color: #eee;
    text-align: center;
  }

h4 {}

  #content h4.eventTitle {
    margin-left: 1%;
    border-bottom: 1px solid blue;
  }

/*
 * ul & li
 */
ul {}

  #navLeft ul.navLetters {
    padding: 0 1em;
    margin: 0 auto;    
    text-align: center;
  }
    #navLeft ul.navLetters li {
      list-style-type: none;
      display: inline;
    }

  ul.committerList {
    list-style-type: none;
    margin: 0;
    padding: 0;
  }

  li.committer {
    margin-left: 1em;
    padding-left: 2px;
    font-size: 90%;
  }

    li.committer h2 {
      margin-top: 1em;
      margin-left: 2px;
      border-bottom: 1px solid black;
      vertical-align: middle;
    }
      li.committer h2 a {
        color: black;
        text-decoration: none;
      }
      li.committer h2 a:hover {
        text-decoration: none;
        background-color: white;
      }

        li.committer h2 a img {
          border: 1px solid blue;
          text-decoration: none;
          margin: 0 .25em;
          vertical-align: middle;
        }


    li.committer p {
      padding: 0;
      margin: 0;
    }

  #navLeft ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
  }

    #navLeft ul li {
      margin: 0;
    }

      #navLeft ul li p {
        margin: 0;
      }

      #navLeft ul li ul {
        list-style-type: none;
        font-size: 90%;
        margin: 0 2em;
      }

        #navLeft ul li ul li {
          margin: 0;
        }


  #content ul.thumbnails li {
    list-style-type: none;
    display: inline;
    padding: .5em;
    width: 250px;
  }

/*
 * p
 */
p {}

  #navLeft p {
    text-align: center;
    padding: 0 auto;
    margin: 0;
  }

  #footer p {
    padding: 0;
  }

  #content p.picture {
    display: inline;
    float: left;
    text-align: center;
    padding: .5em;
    border: 1px dashed #333;
    background-color: #fee;
    margin: .5em;
    font-style: italic;
    font-size: 90%;
  }

    #content p.picture a {
      display: block;
    }
      #content p.picture a img {
        border: 1px solid #fee;
        max-width: 300px;
        width: expression(parseInt(this.offsetWidth) > 300 ? "300px" : "auto");
      }

      #content p.picture a:hover {
        background-color: #fee;
      }

        #content p.picture a:hover img {
          border: 1px solid red;
          max-width: 300px;
          width: expression(parseInt(this.offsetWidth) > 300 ? "300px" : "auto");
        }

  #content p.topalign {
    vertical-align: middle;
    height: 2em;
    text-align: center;
    width: 100%;
    padding: .5em;
    border: 1px solid #ddd;
  }

    #content p.topalign img {
      vertical-align: middle;
      text-align: text-middle;
    }

  #content p.boldRed {
    color: red;
    font-weight: bold;
    border: 2px solid red;
    padding: .5em;
    margin: 1em 2em;
  }

  #content p.quote {
    color: black;
    font-style: italic;
    font-size: 110%;
    margin-left: 10%;
    margin-right: 10%;
    padding: 1em;
    border: 1px solid #ddd;
    text-align: center;
  }

  #content p.navbar {
    font-size: 90%;
    text-align: center;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
  }

  #content p.eventDetail {
    margin-left: 3%;
  }

/*
 * img
 */
img {}

  img.animage {
    border: 1px solid gray;
  }

  #title img {
    float: left;
    border: 0;
    padding: 2px;
  }

  #footer img {
    border: 0;
  }

/*
 * div
 */
div {}

/*
 * pre
 */
pre {}

  #content pre.eventDetail {
    margin-left: 4%;
  }

/*
 * General Classes
 */
.letterSection {
    clear: left;
    padding: 1em;
    border-top: 1px solid #ddd;
}

.bigLetter {
    float: left;
    width: 80px;
    font-weight: bold;
    font-size: 48pt;
    text-align: center;
    background-color: #bbb;
    color: black;
    border: 1px solid black;
    margin: 0;
    padding: 0;
}
  .bigLetter p {
    padding: 0;
    margin: 0;
  }

.letterList {
    margin-left: 90px;
    padding: 0;
}
  .letterList ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
    .letterList ul li {
      height: 34px;
      vertical-align: middle;
      padding: 0;
      margin: 0;
      border-bottom: 1px solid #eee;
    }
      .letterList ul li img {
        vertical-align: middle;
        padding: 0;
        margin: 0;
      }

.centred {
  text-align: center;
}

/*
 * form
 */

form {}

  #content form {
    width: 90%;
    margin: 0 auto;
    border: 1px solid black;
    background-color: #eee;
    padding: 2px 4px;
  }

    #content form table {
      border: 1px solid #bbb;
    }
      #content form table tr td {
        border-bottom: 1px solid #bbb;
      }
      #content form table tr.private td {
        background-color: #bc3435;
      }

span.private {
    background-color: #bc3435;
}

/*
 * Generic classes
 */

.indented {
    margin-left: 3%;
}
.topBanner {
  float: right;
  margin: 0;
  border: 0;
  vertical-align: middle;
}
.noborder {
  border: 0;
  margin: 0;
}
